<!DOCTYPE html>
<html>
  <link rel="shortcut icon" href="static/img/icon.ico" type="image/x-icon" />

  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit" />
    <meta
      name="viewport"
      content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1"
    />
    <title>钉钉签到墙</title>
    <link rel="stylesheet" href="/static/css/reset.css" />
    <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
  </head>

  <body>
    <div id="app"></div>

    <script type="text/javascript">
      $(window).load(function() {
        resizeScreen();
      });
      $(window).resize(function() {
        // 当浏览器大小变化时
        resizeScreen();
      });

      function resizeScreen() {
        var valX = 0;
        var valY = 0;
        // var screenH = window.screen.height
        var documentW = document.documentElement.clientWidth;
        var documentH = document.documentElement.clientHeight;
        var screenW = window.screen.width;
        if (Number(screenW) === 1366) {
          if (documentW < 1366 && documentW > 768) {
            valX = documentW / 1920;
            valY = documentH / 1080;
          } else {
            valX = documentW / 1920;
            valY = documentH / 1080;
          }
        } else {
          if (documentW < 1920 && documentW > 1300) {
            valX = documentW / 1920;
            valY = documentH / 1080;
          } else {
            valX = documentW / 1920;
            valY = documentH / 1080;
          }
        }
        // document.body.style.transform = "translateZ(0) scale(" + valX + ',' + valY + ")";

        document.getElementById("app").style.transform =
          "translateZ(0) scale(" + valX + "," + valY + ")";
      }
    </script>
  </body>
</html>
